<template>
    <div>
        <HeaderIndex :showTwo="false"></HeaderIndex>
        <nav>
            <span>输入手机号</span> &nbsp; > &nbsp;<span>设置密码</span>
        </nav>
        <router-view></router-view>
        <div class="wai">
          <div>
            <input type="text" placeholder="请输入您的手机号码" v-model="text">
          </div>
          <div>
             <input type="password" placeholder="请设置您的密码" v-model="password">
         </div>
         <button @click="fun()">注册</button>
        </div>
        <p>
            <i class="iconfont icon-icon-class-c"></i>猫眼电影 客服电话：
            <span>400-670-5335</span>
        </p>
    </div>
</template>

<script>
import postdata from "@/api/postdata";
import { Toast } from "vant";
export default {
  data() {
    return {
      text: "",
      password: ""
    };
  },
  methods: {
    fun() {
      // 如果你想发送post数据 需要修改数据发送的方式
      let usp = new URLSearchParams();
      usp.append("tel", this.text);
      usp.append("password", this.password);

      postdata("/apidl/register", usp).then(() => {
        Toast.success("注册成功");
        this.$router.push("/account");
      });
    }
  }
};
</script>

<style scoped>
nav {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1;
  color: #333;
  margin: 0;
  overflow: hidden;
  font-size: inherit;
  font-weight: 400;
  position: relative;
  padding: 0.28rem 0.2rem;
  border-bottom: 0;
  text-align: center;
  background-color: white;
  border-bottom: 1px solid #cccccc;
}
.wai {
  background-color: rgb(244, 244, 244);
}
.wai > div {
  width: 100%;
  background-color: white;
  border-bottom: 1px solid rgb(220, 220, 220);
  display: flex;
  justify-content: center;
}
input {
  width: 90%;
  height: 0.58rem;
  border-radius: 0.06rem;
  margin: 0.15rem 0;
  background-color: rgb(236, 236, 236);
  font: inherit;
  font-family: inherit;
  padding: 0 0.15rem;
}
button {
  width: 94%;
  height: 0.6rem;
  display: block;
  margin: 0.27rem auto;
  line-height: 0.6rem;
  border: none;
  color: white;
  background-color: rgb(223, 45, 45);
  font-size: 0.28rem;
  border-radius: 0.1rem;
}
p {
  width: 100%;
  font-size: 0.28rem;
  text-align: center;
  margin: 0.23rem 0px;
}
p > i {
  font-size: 0.12rem;
}
p > span {
  color: rgb(223, 45, 45);
}
</style>
